<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>后台测试</title>

    <!-- 引入样式 -->
    <link rel="stylesheet" href="../../styles/common.css" />

    <style>

    </style>
</head>

<body>

<div id="app">


    <el-container style="height: 750px; border: 1px solid #eee">


<!--1.侧边栏-->
        <el-aside width="250px"  style="background-color: #545c64">

            <div class="demo-image__placeholder">
                <div class="block" style="margin-top: 30px;margin-bottom: 30px">
<!--                    <span class="demonstration">默认</span>-->
                    <el-image style="width: 60%;height: 60%;margin-left: 45px;border-radius: 40%" src="../../images/login/logo7.png"></el-image>

                </div>
            </div>

            <el-menu background-color="#545c64"
                     text-color="#fff"
                     active-text-color="#ffd04b">
<!--            <el-menu :default-openeds="['1', '3']">-->
                <el-submenu index="1">
                    <template slot="title"><i class="el-icon-user"></i>账号管理</template>
                    <el-menu-item-group>
                        <template slot="title">信息</template>
                        <el-menu-item index="0-1" @click="clickUrl('a')">个人信息及数据统计</el-menu-item>
                        <el-menu-item index="0-2" @click="clickUrl('b')">修改个人信息</el-menu-item>
                    </el-menu-item-group>
                    <el-menu-item-group>
                        <template slot="title">信息</template>
                        <el-menu-item index="1-1" @click="clickUrl(1)">前台员工账号</el-menu-item>
                        <el-menu-item index="1-2" @click="clickUrl(2)">会员账号</el-menu-item>
                        <el-menu-item index="1-3" @click="clickUrl(33)">采购员账号</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>

                <el-submenu index="2">
                    <template slot="title"><i class="el-icon-food"></i>菜系管理</template>

                    <el-menu-item-group>
                        <template slot="title">分组一</template>
                        <el-menu-item index="2-1" @click="clickUrl(3)">分类</el-menu-item>
                        <el-menu-item index="2-2" @click="clickUrl(4)">菜品</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>

                <el-submenu index="3">
                    <template slot="title"><i class="el-icon-postcard"></i>通知公告</template>
                    <el-menu-item-group>
                        <template slot="title">美食轮播图</template>
                        <el-menu-item @click="clickUrl(5)" index="3-1-1">运营推广</el-menu-item>
                        <el-menu-item @click="clickUrl(6)" index="3-1-2">热点洞察</el-menu-item>
                    </el-menu-item-group>

                </el-submenu>


                <el-submenu index="4">
                    <template slot="title"><i class="el-icon-aim"></i>餐桌管理</template>
                    <el-menu-item-group>
                        <template slot="title">餐桌</template>
                        <el-menu-item index="4-1-1" @click="clickUrl(7)">餐桌信息</el-menu-item>
                        <el-menu-item index="4-1-2" @click="clickUrl(8)">餐桌预定信息</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>

                <el-submenu index="5">
                    <template slot="title"><i class="el-icon-shopping-cart-1"></i>订单管理</template>
                    <el-menu-item-group>
                        <template slot="title">分组一</template>
                        <el-menu-item index="5-1" @click="clickUrl(11)">餐桌订单表</el-menu-item>
                        <el-menu-item index="5-2" @click="clickUrl(12)">订单明细表</el-menu-item>
                        <el-menu-item index="5-3" @click="clickUrl(122)">餐桌预定订单表</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>

                <el-submenu index="6">
                    <template slot="title"><i class="el-icon-shopping-cart-1"></i>审核</template>
                    <el-menu-item-group>
                        <template slot="title">申请</template>
                        <el-menu-item index="6-1" @click="clickUrl(13)">采购申请</el-menu-item>
                    </el-menu-item-group>
                </el-submenu>

            </el-menu>
        </el-aside>

        <el-container >
<!--2.上边栏-->
            <el-header style=" text-align: right; font-size: 12px">


                <h1 style="margin: 20px 100px 0 0;">欢迎，{{adminInfo.data.name}}</h1>

                <el-dropdown>
                    <i class="el-icon-user-solid" style="font-size: 35px;margin: -40px 0 0px -70px;position: absolute;"></i>
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item><span @click="clickUrl('b')">修改个人信息</span></el-dropdown-item>
                        <el-dropdown-item><span @click="loginOut()">退出登录</span></el-dropdown-item>
                    </el-dropdown-menu>
                </el-dropdown>
<!--                <h1 style="display: inline">{{ adminInfo.data.name }}</h1>-->
            </el-header>

            <div style="width: 100%;height:10px;background-color:whitesmoke;"></div>
            <div style="width: 100%;height:50px;background-color: #c8c8ca;">
                <h1 style=" float: left;margin: 10px 0 0 20px;font-size: 20px">
                    {{infoName}}
                </h1>

                <p style=" float: left;margin: 10px 0 0 800px;font-size: 20px">
                    {{navigate}}<span style="color:red;">{{title}}</span>
                </p>
            </div>

<!--3.主内容(iframe)-->
            <el-main style="background-color: #e6e6e6">
                <div style="border:3px solid #d8d8d8;border-bottom:hidden;width: 100%;height:50px;background-color: #f7f7f7;">
                    <p  style=" float: left;margin: 10px 0 0 10px;font-size: 20px">{{title}}</p>
                </div>
                <div style=";border:3px solid #d8d8d8;width: 100%;height:120%;background-color: white;">

                    <iframe
                            :src="iframeUrl"
                            frameborder="0"
                            name="iframe0"
                            width="100%"
                            height="100%"
                    ></iframe>
                </div>
            </el-main>


        </el-container>
    </el-container>
</div>


<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="../../plugins/vue/vue.js"></script>

<!-- 引入组件库 -->
<script src="../../plugins/element-ui/index.js"></script>

<!-- 引入axios -->
<script src="../../plugins/axios/axios.min.js"></script>


<script>
    new Vue({
        el: "#app",
        data: {
            adminInfo:{},   //用户信息
            infoName:'账号管理',
            navigate:'账号管理/',
            title:'个人信息及数据统计',
            iframeUrl:'childPages/welcome.html',

        },
        created() {
            const adminInfo = window.localStorage.getItem('adminInfo')
            console.log("adminInfo:::"+adminInfo)
            if (adminInfo) {
                this.adminInfo = JSON.parse(adminInfo)
            }
            console.log("adminInfo:::"+adminInfo)
        },
        mounted() {
            window.clickUrl = this.clickUrl
        },
        methods: {
           handleClick(tab, event) {
                console.log(tab, event);
            },

            loginOut(){
                window.location.href='../login/login_admin.html';

            },


           clickUrl(index){
               if (index=="a"){
                   this.infoName='账号管理'
                   this.navigate='账号管理/'
                   this.title='个人信息及数据统计'
                   this.iframeUrl='childPages/welcome.html'
               }else if (index=="b"){
                   this.infoName='账号管理'
                   this.navigate='账号管理/'
                   this.title='修改个人信息'
                   this.iframeUrl='childPages/adminUpdate.html'
               }else if (index=="1"){
                   this.infoName='账号管理'
                   this.navigate='账号管理/'
                   this.title='前台员工账号'
                   this.iframeUrl='childPages/prosceniumList.html'
               }else if (index=="2"){
                   this.infoName='账号管理'
                   this.navigate='账号管理/'
                   this.title='会员账号'
                   this.iframeUrl='childPages/userList.html'
               }else if (index=="33"){
                   this.infoName='账号管理'
                   this.navigate='账号管理/'
                   this.title='采购员账号'
                   this.iframeUrl='childPages/purchaseList.html'
               }else if (index=="3"){
                   this.infoName='菜系管理'
                   this.navigate='菜系管理/'
                   this.title='分类'
                   this.iframeUrl='childPages/typeList.html'
               }else if (index=="4"){
                   this.infoName='菜系管理'
                   this.navigate='菜系管理/'
                   this.title='菜品'
                   this.iframeUrl='childPages/cuisineList.html'
               }else if (index=="5"){
                   this.infoName='通知公告'
                   this.navigate='通知公告/'
                   this.title='运营推广'
                   this.iframeUrl='childPages/news1List.html'
               }else if (index=="6"){
                   this.infoName='通知公告'
                   this.navigate='通知公告/'
                   this.title='热点洞察'
                   this.iframeUrl='childPages/news2List.html'
               }else if (index=="7"){
                   this.infoName='餐桌管理'
                   this.navigate='餐桌管理/'
                   this.title='餐桌信息'
                   this.iframeUrl='childPages/tableList.html'
               }else if (index=="8"){
                   this.infoName='餐桌管理'
                   this.navigate='餐桌管理/'
                   this.title='餐桌预定信息'
                   this.iframeUrl='childPages/scheduleTableList.html'
               }else if (index=="11"){
                   this.infoName='订单管理'
                   this.navigate='订单管理/'
                   this.title='订单表'
                   this.iframeUrl='childPages/ordersList.html'
               }else if (index=="12"){
                   this.infoName='订单管理'
                   this.navigate='订单管理/'
                   this.title='订单明细表'
                   this.iframeUrl='childPages/orderDetailList.html'
               }else if (index=="122"){
                   this.infoName='订单管理'
                   this.navigate='订单管理/'
                   this.title='餐桌预定订单表'
                   this.iframeUrl='childPages/scheduleTableOrdersList.html'
               }else if (index=="13"){
                   this.infoName='申请'
                   this.navigate='申请/'
                   this.title='采购申请'
                   this.iframeUrl='childPages/purchaseRequisitionList.html'
               }
            },

        }
    })
</script>
</body>

</html>



